<script setup>
import {ref} from 'vue'
const askAnswerIndex = ref(0)
const askAnswerConfig = ref([
	{ name:'综合' },
	{ name:'文献' },
	{ name:'资讯' },
	{ name:'政策' },
	{ name:'其它' },
])
const askAnswerClick = (index)=>{
	askAnswerIndex.value = index
}
</script>

<template>
	<div class="askAnswerArea">
		<div class="item" :class="[askAnswerIndex === index ?'selected' :'' ]"
				 v-for="(item,index) in askAnswerConfig"
				 :key="item.name"
				 @click="askAnswerClick(index)"
		>{{item.name}}</div>
	</div>
</template>

<style scoped lang="scss">
.askAnswerArea{
	width: 84px;
	background: #FFFFFF;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 45px;
	.item{
		cursor: pointer;
		font-weight: 330;
		font-size: 18px;
		color: rgba(0,0,0,0.5);
		line-height: 21px;
		margin-bottom: 32px;
		&:hover,
		&.selected{
			color: #00BCFB;
		}
	}
}
</style>
